<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>dom解析元素</title>
		
		<!-- 在HTML里添加JS代码 -->
		<script>
			function fun(){
				//1. 获取id=a的元素 getElementById
				// var x = window.document.getElementById("a");
				// x.innerText ="<h1>我变了...</h1>" ; //修改了标签里的文字
				// console.log(x.innerText); //获取了标签里的文字
				
				// x.innerHTML ="<h1>我变了...</h1>" ; //修改了标签里的文字
				// console.log(x.innerHTML); //获取了标签里的文字
				//innerText 和 innerHTML的区别? 后者可以解析HTML代码/标签
				
				//2. 获取name="me"的元素 getElementsByName
				var y = document.getElementsByName("me");
				console.log( y[0].innerText );//我是div1
				
				//3. 获取span的元素 getElementsByTagName
				//4. 获取class="cls"的元素 getElementsByClassName
				
			}
		</script>
	</head>
	<body>
		<div id="a" name="me">我是div1</div>
		
		<div onclick="fun();">我是div2</div>
		
		<a name="me">我是a</a>
		<span id="b" class="cls">我是span1</span>
		<span name="me">我是span2</span>
		<span class="cls">我是span3</span>
		
		
	</body>
</html>